* {
  margin: 0;
  padding: 0;
}

#image-preview {
  img {
    width: 100%;
  }
}

.good-info {
  // height: 60px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.not-login {
  height: 200px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  border-bottom: 1px solid #ccc;
}

.user-info {
  height: 200px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid #ccc;
  img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
  }
}


.tab {
  display: flex;
  height: 100vh;
  padding-bottom: 50px;
  box-sizing: border-box;
  .left {
    width: 80px;
    height: 100%;
    border-right: 1px solid #ccc;
    overflow-y: scroll;
    ul {
      li {
        margin: 10px 0 10px 6px;
        padding-left: 6px;
        &.active {
          border-left: 2px solid red;
          color: red;
          font-weight: bold;
        }
      }
    }
  }
  .right {
    flex: 1;
    height: 100%;
    overflow-y: scroll;
  }
}